<template>
  <div p-5>
    <DynamicTable
      ref="dynamicTableRef"
      bordered
      :data-request="loadData"
      :columns="columns"
      row-key="heroid"
      :scroll="{
        y: 'calc(100vh - 330px)',
      }"
    >
    </DynamicTable>
  </div>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { aqColumns, type TableColumnItem } from './columns';
  import { useTable } from '@/components/core/dynamic-table';
  import { getCaseArchivesList } from '@/api/supervision/archive-query';
  import { useRouter } from 'vue-router';
  const router = useRouter();

  const [DynamicTable, dynamicTableInstance] = useTable();

  const loadData = async (params): Promise<API.TableListResult> => {
    if (params.rangePicker && params.rangePicker !== null) {
      params.startTime = params.rangePicker[0];
      params.endTime = params.rangePicker[1];
      delete params['rangePicker'];
    }
    const data = await getCaseArchivesList(params);
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: data,
          ...params,
        });
      }, 500);
    });
  };

  const columns: TableColumnItem[] = [
    ...aqColumns,
    {
      title: '操作',
      align: 'center',
      width: 100,
      dataIndex: 'ACTION',
      actions: ({ record }) => [
        {
          label: '查看卷宗',
          onClick: () =>
            router.push({
              path: '/administrative-penalty/volumeView',
              query: { id: record.id },
            }),
        },
      ],
    },
  ];
</script>

<style lang="less" scoped></style>
